<!DOCTYPE html>
<html>
    <head>
        <title>语义一致性流式处理演示</title>
        <style>
            body { font-family: Arial, sans-serif; margin: 20px; background-color: #f5f5f5; }
            .container { max-width: 1200px; margin: 0 auto; background-color: white; padding: 20px; border-radius: 8px; }
            .demo-section { margin: 20px 0; padding: 15px; border: 1px solid #ddd; border-radius: 5px; background-color: #fafafa; }
            .demo-section h2 { margin-top: 0; color: #333; border-bottom: 2px solid #2196F3; padding-bottom: 5px; }
            a { color: #2196F3; text-decoration: none; font-weight: bold; }
            a:hover { text-decoration: underline; }
            .button { display: inline-block; padding: 8px 16px; background-color: #2196F3; color: white; text-decoration: none; border-radius: 4px; margin: 5px; }
            .button:hover { background-color: #1976D2; }
        </style>
    </head>
    <body>
        <div class="container">
            <h1>🎯 语义一致性流式处理演示</h1>
            <p>本演示展示了基于buffer_size的智能缓存控制，确保HTTP头与实际行为一致</p>
            
            <div class="demo-section">
                <h2>🎯 缓冲效果实时演示</h2>
                <p>Linus式设计：代码行为与HTTP头承诺完全一致</p>
                
                <a href="/buffer-demo/0" class="button" target="_blank">⚡ 零延迟模式</a>
                <a href="/buffer-demo/4096" class="button" target="_blank">📦 低延迟模式</a>
                <a href="/buffer-demo/16384" class="button" target="_blank">📦 平衡模式</a>
                <a href="/buffer-demo/65536" class="button" target="_blank">📦 高吞吐模式</a>
                
                <div style="margin-top: 20px; padding: 15px; background-color: #e8f5e8; border-radius: 5px;">
                    <h4>🎯 Linus式设计原则验证</h4>
                    <ul>
                        <li><strong>语义一致性</strong>：HTTP头与实际行为100%匹配</li>
                        <li><strong>零欺骗</strong>：说实时就是实时，说缓冲就是缓冲</li>
                        <li><strong>简单胜过复杂</strong>：一个参数控制所有行为</li>
                        <li><strong>实用主义</strong>：只解决真实存在的性能问题</li>
                    </ul>
                </div>
            </div>
        </div>
    </body>
</html>